irongit

Waybar configuration

dotbar/style/[Wallust Transparent] Crystal Clear.css
214 lines4.0 KBCSS
1/* ----------- 💫 https://github.com/JaKooLit 💫 -------- */
2/* ....Wallust Transparent - Crystal Clear........ */
3/* --- 👍 original designed by https://github.com/Krautt 👍 --- */
4
5@import '../../.config/waybar/wallust/colors-waybar.css';
6
7@define-color critical #ff0000; /* critical color */
8@define-color warning #f3f809; /* warning color */
9@define-color text @color12; /* text color */
10@define-color text-alt @color13; /* text alternative color */
11@define-color bg @color7; /* background color */
12
13*{
14 font-family: "JetBrainsMono Nerd Font";
15 font-weight: bold;
16 min-height: 0;
17 /* set font-size to 100% if font scaling is set to 1.00 using nwg-look */
18 font-size: 97%;
19 font-feature-settings: '"zero", "ss01", "ss02", "ss03", "ss04", "ss05", "cv31"';
20}
21
22window#waybar {
23 background:transparent;
24 border-radius: 1px;
25 color: @text;
26}
27
28window#waybar.hidden {
29 opacity: 0.5;
30}
31window#waybar.empty {
32 background-color: transparent;
33}
34
35window#waybar.empty #window {
36 padding: 0px;
37 border: 0px;
38 background-color: transparent;
39}
40
41/*-----module groups----*/
42.modules-right {
43
44}
45
46.modules-center {
47
48}
49
50.modules-left {
51
52}
53
54tooltip {
55 color: @color12;
56 background: @color10;
57 opacity: 0.8;
58 border-radius: 10px;
59 border-width: 1px;
60 border-style: solid;
61}
62
63#taskbar button,
64#workspaces button {
65 color: @text-alt;
66 box-shadow: none;
67 text-shadow: none;
68 padding: 0px;
69 border-radius: 9px;
70 padding-left: 4px;
71 padding-right: 4px;
72 animation: gradient_f 20s ease-in infinite;
73 transition: all 0.5s cubic-bezier(.55,-0.68,.48,1.682);
74}
75
76#taskbar button.active,
77#workspaces button.active {
78 color: @text;
79 border-radius: 15px 15px 15px 15px;
80 padding-left: 8px;
81 padding-right: 8px;
82 animation: gradient_f 20s ease-in infinite;
83 transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
84}
85
86#workspaces button.focused {
87 color: @text-alt;
88}
89
90#workspaces button.urgent {
91 color: @warning;
92 border-radius: 10px;
93}
94
95#taskbar button:hover,
96#workspaces button:hover {
97 color: @text;
98 border-radius: 15px;
99 padding-left: 2px;
100 padding-right: 2px;
101 animation: gradient_f 20s ease-in infinite;
102 transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
103}
104
105#backlight,
106#battery,
107#bluetooth,
108#clock,
109#cpu,
110#disk,
111#idle_inhibitor,
112#keyboard-state,
113#memory,
114#mode,
115#mpris,
116#network,
117#power-profiles-daemon,
118#pulseaudio,
119#temperature,
120#tray,
121#window,
122#wireplumber,
123#workspaces,
124#custom-backlight,
125#custom-browser,
126#custom-cava_mviz,
127#custom-cycle_wall,
128#custom-dot_update,
129#custom-file_manager,
130#custom-keybinds,
131#custom-keyboard,
132#custom-light_dark,
133#custom-lock,
134#custom-hint,
135#custom-hypridle,
136#custom-menu,
137#custom-playerctl,
138#custom-power_vertical,
139#custom-power,
140#custom-quit,
141#custom-reboot,
142#custom-settings,
143#custom-spotify,
144#custom-swaync,
145#custom-tty,
146#custom-updater,
147#custom-weather,
148#custom-weather.clearNight,
149#custom-weather.cloudyFoggyDay,
150#custom-weather.cloudyFoggyNight,
151#custom-weather.default
152#custom-weather.rainyDay,
153#custom-weather.rainyNight,
154#custom-weather.severe,
155#custom-weather.showyIcyDay,
156#custom-weather.snowyIcyNight,
157#custom-weather.sunnyDay {
158 padding-top: 4px;
159 padding-bottom: 4px;
160 padding-right: 6px;
161 padding-left: 6px;
162}
163
164#temperature.critical {
165 background-color: #ff0000;
166}
167
168@keyframes blink {
169 to {
170 color: #000000;
171 }
172}
173
174/*-----Indicators----*/
175#custom-hypridle.notactive,
176#idle_inhibitor.activated {
177 color: #39FF14;
178}
179
180#battery.critical:not(.charging) {
181 color: @critical;
182 animation-name: blink;
183 animation-duration: 3.0s;
184 animation-timing-function: steps(12);
185 animation-iteration-count: infinite;
186 animation-direction: alternate;
187}
188
189#backlight-slider slider,
190#pulseaudio-slider slider {
191 min-width: 0px;
192 min-height: 0px;
193 opacity: 0;
194 background-image: none;
195 border: none;
196 box-shadow: none;
197}
198
199#backlight-slider trough,
200#pulseaudio-slider trough {
201 min-width: 80px;
202 min-height: 10px;
203 border-radius: 5px;
204 background-color: black;
205}
206
207#backlight-slider highlight,
208#pulseaudio-slider highlight {
209 min-height: 10px;
210 border-radius: 5px;
211 background-color: wheat;
212}
213
214